<template>
  <div class="login">
    <a-row>
      <a-col :span="16" class="banner"></a-col>
      <a-col :span="8" class="form">
        <div class="content">
          <div class="title">登录系统</div>
          <a-form layout="vertical">
            <a-form-item label="账号">
              <a-input placeholder="请输入用户账号"></a-input>
            </a-form-item>
            <a-form-item label="密码" style="margin-bottom: 0">
              <a-input-password placeholder="请输入用户密码"></a-input-password>
            </a-form-item>
          </a-form>
          <a-button type="primary" long>登录</a-button>
        </div>
        <div class="copyright">Copyright @ 2023-2025 UseMath 尚数科技. 版权所有</div>
      </a-col>
    </a-row>
  </div>
</template>

<style lang="scss" scoped>
  .login {
    height: 100vh;

    .banner {
      height: 100vh;
      background-color: #f2f2f2;
    }

    .form {
      height: 100vh;
      padding: 200px 48px 100px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;

      .title {
        font-size: 24px;
        font-weight: bold;
        text-align: center;
      }

      .content {
        display: flex;
        flex-direction: column;
        gap: 32px;
      }

      .copyright {
        text-align: center;
        font-size: 14px;
        color: #999;
      }
    }
  }
</style>
